javascript实现弹出层效果
弹出层和弹窗相似但是并不相同；弹窗和弹出层都是由用户触发的显示提示信息的弹出面板；但是弹窗只是显示一些信息，没有太多的复杂的交互事件；而弹层类似一个整个页面，可以实现页面的所有功能； 现在前端弹层使用的很频繁，如支付宝支付弹层等…所以掌握弹层是一个很重要的技能。如果...
2024-01-10javascript实现点亮灯泡特效示例
本文实例为大家分享了javascript实现点亮灯泡特效的具体代码，供大家参考，具体内容如下<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-...
2024-01-10原生javascript实现分页效果
随着近几年前端行业的迅猛发展，各种层出不穷的新框架，新方法让我们有点眼花缭乱。最近刚好比较清闲，所以没事准备撸撸前端的根基javascript,纯属练练手，写个分页，顺便跟大家分享一下function pageFunc(conf){ this.myFunc = conf.click //用户点击要执行的方法 this.total = conf.total; //总页数 this.currentPage = ...
2024-01-10javascript 获取浏览器版本
工作中需要通过JS去获取当前使用的浏览器的名字以及版本号，网上大堆资料都有一个关键词是 navigator.appName，但是这个方法获取的浏览器的名字只有两种要么是IE要么就是Netscap，倒是可以用来判断是否使用了IE，但是我想获取具体的浏览器产品名字比如 Firefox，Chrome等。function BroswerUtil() {}BroswerU...
2024-01-10javascript特殊文本输入框网页特效
本文实例为大家分享了特殊js文本输入框网页特效，供大家参考，具体内容如下实例一：让文本框只带有下划线<script type="text/javascript"> function changeTextStyle(){ //让文本框只带有下划线 //获得文本框的DOM var myText = document.getElementById("myText"); myText.style.borderColor = 'black';...
2024-01-10
javascript实现电商放大镜效果
本文实例为大家分享了javascript实现电商放大镜效果的具体代码，供大家参考，具体内容如下学习内容：1、event.pageX 属性返回鼠标指针的位置，相对于文档的左边缘。2、clientX 事件属性返回当事件被触发时鼠标指针相对于浏览器页面（或客户区）的水平坐标。3、onmouseenter鼠标移入4、onmouseleave鼠标移...
2024-01-10分享一则javascript 调试技巧
不用alert,用console.log()<!DOCTYPE html> <html> <head> <script type="text/javascript"> function showLog(message){ console.log(message); } function test(name){ showLog(name); } test("hello"); </script> </head> <body> </body> </html>以上算是一个个人心得，这...
2024-01-10javascript搜索框效果实现方法
本文实例讲述了javascript搜索框效果实现方法。分享给大家供大家参考。具体实现方法如下：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content...
2024-01-10javascript实现超好看的3D烟花特效
本文实例为大家分享了超好看3D烟花的具体代码，供大家参考，具体内容如下<!doctype html><html><head><meta charset="utf-8"><title>3D烟花</title><style>html,body{ margin:0px; width:100%; height:100%; overflow:hidden; background:#000;}#canvas{ width:100%; height:100%;}</style></head><body><canvas i...
2024-01-10javascript+css3 实现动态按钮菜单特效
一个菜单按钮特效案例，简单的实现了动态效果。废话不多说了，直接给大家贴代码了，代码写好不好，还请给位大侠多多指教。<div class="bar" id="menubar"><div class="menu" id="menu0"></div><div class="menu" id="menu1"></div><div class="menu" id="menu2"></div></div>.bar{width:px;height:px;border:px solid #ccc;border-radius...
2024-01-10基于javascript html5实现3D翻书特效
这是一款十分炫酷的HTML5 3D书本翻页动画，效果相对比较简单，拖拽鼠标模拟用手翻页，更漂亮的是翻页过程中，呈现出逼真的3D立体效果。书本中的文字和图片也会3D展示，非常酷。在线演示 源码下载HTML代码<div class="book p3d"> <div class="back-cover p3d"> <div class="page back flip"></div> <div class="page front p3d">...
2024-01-10Javascript实现鼠标点击冒泡特效
本文实例为大家分享了js鼠标点击冒泡的具体代码，供大家参考，具体内容如下一个用JS写的鼠标左击特效点击鼠标左键会出现红心”❤”或者字符表情“(๑•́ ₃ •̀๑)”…常用Emoji可以自行替换，如需复制，请从底部链接移步至Github代码onload = function() { var click_cnt = 0; var $html = document.getElement...
2024-01-10基于javascript实现窗口抖动效果
本文实例讲解了基于javascript实现窗口抖动效果的详细代码，分享给大家供大家参考，具体内容如下效果图：鼠标点击，窗口实现抖动。具体代码：<!DOCTYPE HTML><html><head><meta charset="gb2312"/><title>窗口登陆效果</title><style type="text/css">#win{ position:relative; width:100px; height:100px; background-color:#666;}</sty...
2024-01-10javascript 兼容各个浏览器的事件
调用事件：事件对象什么是事件对象？在触发dom上的事件是都会产生一个事件对象event。例如鼠标点击的时候，自己就会产生比如点击的类型啊 还要那个元素发出的dom 事件对象 type 属性用于获取事件对象， target属性 用于获取事件目标，stopPropagation()方法 阻止事件冒泡 preventDefault阻止事件的默认...
2024-01-10基于javascript实现随机颜色变化效果
本文实例讲解了基于javascript实现随机颜色变化效果，分享给大家供大家参考，具体内容如下<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>随机颜色变化效果</title> <style type="text/css">#thediv{ width:100px; height:100px;}</style><script type="text/javascript"> v...
2024-01-10新年快乐! javascript实现超级炫酷的3D烟花特效
本文实例为大家分享了javascript实现3D烟花特效的具体代码，供大家参考，具体内容如下<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <meta charset="utf-8"><title>3D烟花</title><style>html,body{ margin:0px; width:100%; height:100%; overflow:hidden; background:#000;}#canvas{ w...
2024-01-10javascript实现京东快递单号的查询效果
案例：模拟京东快递单号的查询效果，供大家参考，具体内容如下要求：当我们在文本框中输入内容时，文本框上面自动显示大字号的内容分析：输入内容时，上面的大盒子会自动显示出来（这里字号更大）表单检测用户输入，给表单添加键盘事件同时把快递单号里面的值（value）获取过来复制...
2024-01-10Javascript条件 - 不隐藏ID
我试图隐藏ID“隐藏主页”，它的整体工作，除了我的第二个条件，我想隐藏它在所述的URL（http://wgzrv.ndxva.servertrust.com/login.asp）。我错过了什么吗？Javascript条件 - 不隐藏ID<script type="text/javascript"> $(window).resize(function(){ function showMyDiv() { if (window.location.href == "http://wgz...
2024-01-10
js canvas实现随机粒子特效
本文实例为大家分享了js canvas随机粒子特效的具体代码，供大家参考，具体内容如下前言canvas实现前端的特效美术结果展示代码html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-sca...
2024-01-10javascript实现鼠标点击页面 移动DIV
<script type="text/javascript"> //那种方式移动 var choMove = false; //是否绑定过click var isClick = true; //引用DIV var oDiv = null; //引用Input var oInput = null; //封装事件绑定的通用对象 var evnetUtil = { addEventHandle:function(oElement,evtype,fun){ oElement.attachEvent?oElem...
2024-01-10将时间作为变量添加到日期 - javascript
我有一些JavaScript代码比较当前日期和时间以及事件日期和开始时间之间的差异。将时间作为变量添加到日期 - javascript然后计算两个日期之间在天数，小时数，分钟数和秒数上的差异。日期是从时间分裂，而手动输入时间的工作原理：var compareDate = new Date("<?php echo $qdate->format('D M j Y 13:30:00'); ?>"); 如...
2024-01-10javascript 动态生成css代码的两种方法
javascript 动态生成css代码的两种方法有时候我们需要利用js来动态生成页面上style标签中的css代码，方法很直接，就是直接创建一个style元素，然后设置style元素里面的css代码，最后把它插入到head元素中。但有些兼容性问题我们需要解决。首先在符合w3c标准的浏览器中我们只需要把要插入的css代码作为一...
2024-01-10
【JS】javascript logger日志工具
1.项目简介创意无限,简单实用 javascript logger&debug toolbox - kingfishersKingfishers是用原生态javascript语言编写的web日志&调试工具箱，主要用于客户端脚本的分析和查错。工具提供了$alert函数来代替js的alert函数,该函数除了能够在工具的控制台连续输出日志&调试信息外,还能够支持对Date,Function,Array,Object,DOM,js...
2024-01-10
JavaScript网页特效学习笔记2 - java线程例子
JavaScript网页特效学习笔记2 2012-05-25 19:06 java线程例子 阅读(191) 评论(0) 编辑 收藏 举报今天又从书上和视频中学到了几个网页常见的JavaScript特效，也知道了几个在html页面中很少用到的属性。1、按钮只能被单击一次上网的时候可能会看到当单击按钮之后，就不能再次的单击了，直...
2024-01-10javascript html5移动端轻松实现文件上传
PC端上传文件多半用插件，引入flash都没关系，但是移动端要是还用各种冗余的插件估计得被喷死，项目里面需要做图片上传的功能，既然H5已经有相关的接口且兼容性良好，当然优先考虑用H5来实现。用的技术主要是：ajaxFileReaderFormDataHTML结构：<div class="camera-area"> <form enctype="multipart/form-data" metho...
2024-01-10
